<template>
  <lay-layer v-model="visible" :shade="true" :shadeClose="false" shadeOpacity="0.2" :area="['750px', '630px']" :success="init" :btn="action">
    <div style="padding: 20px">
      <lay-form :model="addLocalJobBo" ref="formRef">
        <lay-form-item label="标题" mode="inline" prop="jobTitle" required>
          <lay-input v-model="addLocalJobBo.jobTitle"></lay-input>
        </lay-form-item>
        <lay-form-item label="模块" mode="inline" prop="beanName" required>
          <lay-select class="search-input" v-model="addLocalJobBo.beanName" :options="beanNameList" @change="changeBeanName" placeholder="请选择">
          </lay-select>
        </lay-form-item>
        <lay-form-item label="方法" mode="inline" prop="methodName" required>
          <lay-select class="search-input" v-model="addLocalJobBo.methodName" :options="methodNameList" @change="showMethodParamList" placeholder="请选择"></lay-select>
        </lay-form-item>
        <lay-form-item label="cron" mode="inline" prop="cronExpression" required>
          <lay-input v-model="addLocalJobBo.cronExpression"></lay-input>
        </lay-form-item>
        <lay-form-item label="参数">
          <lay-input v-model="addLocalJobBo.methodParams" placeholder="请填写json格式"></lay-input>
          <lay-collapse>
            <lay-collapse-item title="标题" id="1">
              <template #title>参数文档</template>
              <lay-table
                  :height="'100%'"
                  :columns="columns"
                  :loading="fxwPage.loading.value"
                  :default-toolbar="false"
                  :emptyDescription="'没有参数'"
                  maxHeight="300px"
                  :data-source="fxwPage.dataSource.value">
              </lay-table>
            </lay-collapse-item>
          </lay-collapse>
        </lay-form-item>
        <lay-form-item label="日志状态" mode="inline" required>
          <lay-switch v-model="addLocalJobBo.logStatus"
                      onswitch-value="on" unswitch-value="off"
                      onswitch-text="启用"  unswitch-text="禁用">
          </lay-switch><span>&nbsp;&nbsp;启用时，所有日志都记录</span>
        </lay-form-item>
        <lay-form-item label="邮件状态" mode="inline" required>
          <lay-switch v-model="addLocalJobBo.mailStatus"
                      onswitch-value="on" unswitch-value="off"
                      onswitch-text="启用"  unswitch-text="禁用">
          </lay-switch><span>&nbsp;&nbsp;启用时，异常发送邮件</span>
        </lay-form-item>
        <lay-form-item label="邮件地址" mode="inline">
          <lay-input v-model="addLocalJobBo.mailAddress"></lay-input>
        </lay-form-item>
        <lay-form-item label="子任务" mode="inline">
          <lay-input v-model="addLocalJobBo.nextJobIds" placeholder="子任务ID以逗号分割"></lay-input>
        </lay-form-item>
        <lay-form-item label="子任务模式" mode="inline">
          <lay-radio v-model="addLocalJobBo.nextJobMode" name="nextJobMode" value="sync" label="同步"></lay-radio>
          <lay-radio v-model="addLocalJobBo.nextJobMode" name="nextJobMode" value="async" label="异步"></lay-radio>
        </lay-form-item>
        <lay-form-item label="子任务受限" mode="inline">
          <lay-radio v-model="addLocalJobBo.nextJobLimit" name="nextJobLimit" value="ex_stop" label="异常中断"></lay-radio>
          <lay-radio v-model="addLocalJobBo.nextJobLimit" name="nextJobLimit" value="ex_goon" label="异常继续"></lay-radio>
        </lay-form-item>
        <lay-form-item label="描述" prop="note">
          <lay-textarea v-model="addLocalJobBo.note" placeholder="请输入描述"></lay-textarea>
        </lay-form-item>
      </lay-form>
    </div>
  </lay-layer>
</template>
<script setup lang="ts">
import {ref} from 'vue'
import {addLocalJob} from "@/api/module/localJob";
import useFxwForm from "@/hooks/useFxwForm";
import {buildBeanNameOptions, buildMethodNameOptions,getMethodParamList} from "@/library/objectUtil";
import useFxwPage from "@/hooks/useFxwPage";

const {changeVisible,visible,toReset} = useFxwForm()

const fxwPage = useFxwPage();
const props = defineProps({
  localJobDocument: {
    type: Object,
    default: {}
  }
});
const formRef = ref();
const emit = defineEmits(['refreshParent'])
const addLocalJobBo = ref({
  jobTitle: '',
  beanName: '',
  methodName:'',
  methodParams: '',
  cronExpression:'',
  note: '',
  logStatus: 'on',
  mailStatus: 'on',
  mailAddress: '',
  nextJobIds:'',
  nextJobMode: 'sync',
  nextJobLimit: 'ex_stop',
})


const init = ()=> {
  initBeanNameList();
}

// 任务切换
const beanNameList = ref<Array<{label: string,value:string}>>()
const methodNameList = ref<Array<{label: string,value:string}>>()
const initBeanNameList = function (){
    beanNameList.value = buildBeanNameOptions(props.localJobDocument)
}
const changeBeanName = function (v:string){
  methodNameList.value = buildMethodNameOptions(props.localJobDocument[v])
}

const columns = ref([
  { title: '参数名', width: '80px', key: 'key', fixed: 'left' },
  { title: '数据类型', width: '120px', key: 'type' },
  { title: '是否必填', width: '120px', key: 'require' },
  { title: '样例', width: '120px', key: 'example',},
  { title: '描述', width: '100px', key: 'desc' },
])

// 获取参数
const showMethodParamList = function (){
  fxwPage.dataSource.value = getMethodParamList(props.localJobDocument,addLocalJobBo.value)
}

// 新增任务
const action = ref([
  {
    text: "确认",
    callback: () => {
      addLocalJob(addLocalJobBo.value).then(res => {
        if (res.code === 200) {
          emit('refreshParent')
          toReset(formRef)
          changeVisible();
        }
      })
    }
  },
  {
    text: "取消",
    callback: () => {
      changeVisible();
    }
  }
])

defineExpose({
  changeVisible
})

</script>

<style scoped>
.layui-form {
  .layui-tag {
    margin: 8px 4px 0 0;
  }
}


</style>